<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>布局——computed计算属性</title>
    <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
</head>
<body>
<div id="vue">
    <p>调用当前事件的方法1：{{currentTime1()}}</p>
    <p>调用当前事件的方法 ：{{time}}</p>
    <p>当前时间的计算属性 ：{{currentTime2}}</p>
    <button type="button" @click="currentTime1()">点击时间函数</button>

    <hr>
<!--    {{sum}}<br>-->
<!--    {{sum>10?'大于10':'小于10'}}<br>-->
    <!--
    @click 指定点击时间要执行的方法
    -->
<!--    <button type="button" @click="increment(1)">增加</button>-->

</div>

<script type="text/javascript">
    Vue.config.productionTip = false;
    var vm = new Vue({
        el: "#vue",
        data: {
            message: 'Hello Vue',
            sum: 0,
            time: Date.now()
        },
        //方法
        methods: {
            currentTime1:function () {
                this.time = Date.now();
                console.log("-----currentTime1-----");
                var time = Date.now();
                console.log("currentTime1::" + time);
                return time;

            },
            //delete 步长
            // increment:function (deleta) {
            //     this.sum += deleta;
            // }
        },
        //计算属性
        computed: {
            currentTime2: function () {
                //无意义
                this.message;
                console.log(this.message);
                //当前的值返回后会保存起来
                return Date.now();
            }
        }
    });
</script>
</body>

</html>